import React, { useRef } from 'react'
import './index.css'
import { LeftOutlined, RightOutlined } from '@ant-design/icons';
const Index: React.FC = () => {
    const containerRef = useRef<HTMLDivElement>(null);
    const containerRef2 = useRef<HTMLDivElement>(null);
    const containerRef3 = useRef<HTMLDivElement>(null);
    const containerRef4 = useRef<HTMLDivElement>(null);
    const containerRef5 = useRef<HTMLDivElement>(null);
    const containerRef6 = useRef<HTMLDivElement>(null);
    const containerRef7 = useRef<HTMLDivElement>(null);
    const containerRef8 = useRef<HTMLDivElement>(null);
    const containerRef9 = useRef<HTMLDivElement>(null);
    const containerRef10 = useRef<HTMLDivElement>(null);
    const containerRef11 = useRef<HTMLDivElement>(null);
    const containerRef12 = useRef<HTMLDivElement>(null);

    const scrollLeft = () => {
        if (containerRef.current) {
            containerRef.current.scrollBy({ left: -700, behavior: 'smooth' });
        }
    };

    const scrollRight = () => {
        if (containerRef.current) {
            containerRef.current.scrollBy({ left: 700, behavior: 'smooth' });
        }
    };

    const scrollLeft2 = () => {
        if (containerRef2.current) {
            containerRef2.current.scrollBy({ left: -700, behavior: 'smooth' });
        }
    };

    const scrollRight2 = () => {
        if (containerRef2.current) {
            containerRef2.current.scrollBy({ left: 700, behavior: 'smooth' });
        }
    };

    const scrollLeft3 = () => {
        if (containerRef3.current) {
            containerRef3.current.scrollBy({ left: -700, behavior: 'smooth' });
        }
    };

    const scrollRight3 = () => {
        if (containerRef3.current) {
            containerRef3.current.scrollBy({ left: 700, behavior: 'smooth' });
        }
    };

    const scrollLeft4 = () => {
        if (containerRef4.current) {
            containerRef4.current.scrollBy({ left: -700, behavior: 'smooth' });
        }
    };

    const scrollRight4 = () => {
        if (containerRef4.current) {
            containerRef4.current.scrollBy({ left: 700, behavior: 'smooth' });
        }
    };

    const scrollLeft5 = () => {
        if (containerRef5.current) {
            containerRef5.current.scrollBy({ left: -700, behavior: 'smooth' });
        }
    };

    const scrollRight5 = () => {
        if (containerRef5.current) {
            containerRef5.current.scrollBy({ left: 700, behavior: 'smooth' });
        }
    };

    const scrollLeft6 = () => {
        if (containerRef6.current) {
            containerRef6.current.scrollBy({ left: -700, behavior: 'smooth' });
        }
    };

    const scrollRight6 = () => {
        if (containerRef6.current) {
            containerRef6.current.scrollBy({ left: 700, behavior: 'smooth' });
        }
    };

    const scrollLeft7 = () => {
        if (containerRef7.current) {
            containerRef7.current.scrollBy({ left: -700, behavior: 'smooth' });
        }
    };

    const scrollRight7 = () => {
        if (containerRef7.current) {
            containerRef7.current.scrollBy({ left: 700, behavior: 'smooth' });
        }
    };

    const scrollLeft8 = () => {
        if (containerRef8.current) {
            containerRef8.current.scrollBy({ left: -700, behavior: 'smooth' });
        }
    };

    const scrollRight8 = () => {
        if (containerRef8.current) {
            containerRef8.current.scrollBy({ left: 700, behavior: 'smooth' });
        }
    };

    const scrollLeft9 = () => {
        if (containerRef9.current) {
            containerRef9.current.scrollBy({ left: -700, behavior: 'smooth' });
        }
    };

    const scrollRight9 = () => {
        if (containerRef9.current) {
            containerRef9.current.scrollBy({ left: 700, behavior: 'smooth' });
        }
    };

    const scrollLeft10 = () => {
        if (containerRef10.current) {
            containerRef10.current.scrollBy({ left: -700, behavior: 'smooth' });
        }
    };

    const scrollRight10 = () => {
        if (containerRef10.current) {
            containerRef10.current.scrollBy({ left: 700, behavior: 'smooth' });
        }
    };

    const scrollLeft11 = () => {
        if (containerRef11.current) {
            containerRef11.current.scrollBy({ left: -700, behavior: 'smooth' });
        }
    };

    const scrollRight11 = () => {
        if (containerRef11.current) {
            containerRef11.current.scrollBy({ left: 700, behavior: 'smooth' });
        }
    };

    const scrollLeft12 = () => {
        if (containerRef12.current) {
            containerRef12.current.scrollBy({ left: -700, behavior: 'smooth' });
        }
    };

    const scrollRight12 = () => {
        if (containerRef12.current) {
            containerRef12.current.scrollBy({ left: 700, behavior: 'smooth' });
        }
    };
    return (
        <div>
            <div>
                <h2><img src="https://www.chuangkit.com/distsaas/img/favorite.db60c401.svg" alt="" /> 收藏场景</h2>
                <div className="createbomcc">
                    <p onClick={scrollLeft} className="btn"><LeftOutlined /></p>
                    <div className="nei" ref={containerRef}>
                        {/* 在这里添加内容，例如多个图片或列表项 */}
                        <dl>
                            <dt>
                                <img src="https://st-gdx.dancf.com/templets/84918/shots/20190313-104455-TJeua.png" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://pub-cdn-oss.chuangkit.com/designTemplate/2022/10/31/f9b93d2d-77ea-408f-aa32-35f560b66290_thumb_gif?v=1717893572000&imageMogr2%2Fthumbnail%2F400x%3E%2Fformat%2Fgif/cgif/35" alt="" />
                            </dt>
                            <dd>
                                <p><span>小红书配图</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://pub-cdn-oss.chuangkit.com/designTemplate/2022/10/31/f9b93d2d-77ea-408f-aa32-35f560b66290_thumb_gif?v=1717893572000&imageMogr2%2Fthumbnail%2F400x%3E%2Fformat%2Fgif/cgif/35" alt="" />
                            </dt>
                            <dd>
                                <p><span>公众号首图</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://gd-filems.dancf.com/gaoding/gaoding/95714/88ce56e7-316d-49b6-8fb6-d47ce4fec5bd9429.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>每日一签</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://gd-filems.dancf.com/gaoding/cms/mcm79j/mcm79j/76191/e4a3bca2-424f-45e4-a174-6f8e778b35ea883178.png" alt="" />
                            </dt>
                            <dd>
                                <p><span>全屏海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>长图海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>PPT16:9</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                    </div>

                    <button onClick={scrollRight} className="btn"><RightOutlined /></button>
                </div>
            </div>
            <div>
                <h2><img src="https://www.chuangkit.com/distsaas/img/ai-design.e9dea042.svg" alt="" />智能设计</h2>
                <div className="createbomcc">
                    <p onClick={scrollLeft2} className="btn"><LeftOutlined /></p>
                    <div className="nei" ref={containerRef2}>
                        {/* 在这里添加内容，例如多个图片或列表项 */}
                        <dl>
                            <dt>
                                <img src="https://pub-cdn-oss.chuangkit.com/designTemplate/2024/08/30/66e36909-f482-4232-b93d-6f5a57d50fef_thumb?v=1725242401000&imageMogr2%2Fthumbnail%2F400x%3E%2Fformat%2Fwebp%2Fsharpen%2F70" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://pub-cdn-oss.chuangkit.com/designTemplate/2024/08/30/66e36909-f482-4232-b93d-6f5a57d50fef_thumb?v=1725242401000&imageMogr2%2Fthumbnail%2F400x%3E%2Fformat%2Fwebp%2Fsharpen%2F70" alt="" />
                            </dt>
                            <dd>
                                <p><span>小红书配图</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://pub-cdn-oss.chuangkit.com/designTemplate/2024/08/30/66e36909-f482-4232-b93d-6f5a57d50fef_thumb?v=1725242401000&imageMogr2%2Fthumbnail%2F400x%3E%2Fformat%2Fwebp%2Fsharpen%2F70" alt="" />
                            </dt>
                            <dd>
                                <p><span>公众号首图</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://pub-cdn-oss.chuangkit.com/designTemplate/2024/08/30/66e36909-f482-4232-b93d-6f5a57d50fef_thumb?v=1725242401000&imageMogr2%2Fthumbnail%2F400x%3E%2Fformat%2Fwebp%2Fsharpen%2F70" alt="" />
                            </dt>
                            <dd>
                                <p><span>每日一签</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://pub-cdn-oss.chuangkit.com/designTemplate/2024/08/30/66e36909-f482-4232-b93d-6f5a57d50fef_thumb?v=1725242401000&imageMogr2%2Fthumbnail%2F400x%3E%2Fformat%2Fwebp%2Fsharpen%2F70" alt="" />
                            </dt>
                            <dd>
                                <p><span>全屏海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://pub-cdn-oss.chuangkit.com/designTemplate/2024/08/30/66e36909-f482-4232-b93d-6f5a57d50fef_thumb?v=1725242401000&imageMogr2%2Fthumbnail%2F400x%3E%2Fformat%2Fwebp%2Fsharpen%2F70" alt="" />
                            </dt>
                            <dd>
                                <p><span>长图海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://pub-cdn-oss.chuangkit.com/designTemplate/2024/08/30/66e36909-f482-4232-b93d-6f5a57d50fef_thumb?v=1725242401000&imageMogr2%2Fthumbnail%2F400x%3E%2Fformat%2Fwebp%2Fsharpen%2F70" alt="" />
                            </dt>
                            <dd>
                                <p><span>PPT16:9</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://pub-cdn-oss.chuangkit.com/designTemplate/2024/08/30/66e36909-f482-4232-b93d-6f5a57d50fef_thumb?v=1725242401000&imageMogr2%2Fthumbnail%2F400x%3E%2Fformat%2Fwebp%2Fsharpen%2F70" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://pub-cdn-oss.chuangkit.com/designTemplate/2024/08/30/66e36909-f482-4232-b93d-6f5a57d50fef_thumb?v=1725242401000&imageMogr2%2Fthumbnail%2F400x%3E%2Fformat%2Fwebp%2Fsharpen%2F70" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://pub-cdn-oss.chuangkit.com/designTemplate/2024/08/30/66e36909-f482-4232-b93d-6f5a57d50fef_thumb?v=1725242401000&imageMogr2%2Fthumbnail%2F400x%3E%2Fformat%2Fwebp%2Fsharpen%2F70" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                    </div>

                    <button onClick={scrollRight2} className="btn"><RightOutlined /></button>
                </div>
            </div>
            <div>
                <h2>海报</h2>
                <div className="createbomcc">
                    <p onClick={scrollLeft3} className="btn"><LeftOutlined /></p>
                    <div className="nei" ref={containerRef3}>
                        {/* 在这里添加内容，例如多个图片或列表项 */}

                        <dl>
                            <dt>
                                <img src="https://pub-cdn-oss.chuangkit.com/designTemplate/2023/11/28/8f05eb60-fd31-4253-b682-09c0e8156b4b_thumb?v=1716931517000&imageMogr2%2Fthumbnail%2F400x%3E%2Fformat%2Fwebp%2Fsharpen%2F70" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://pub-cdn-oss.chuangkit.com/designTemplate/2023/11/28/8f05eb60-fd31-4253-b682-09c0e8156b4b_thumb?v=1716931517000&imageMogr2%2Fthumbnail%2F400x%3E%2Fformat%2Fwebp%2Fsharpen%2F70" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://pub-cdn-oss.chuangkit.com/designTemplate/2023/11/28/8f05eb60-fd31-4253-b682-09c0e8156b4b_thumb?v=1716931517000&imageMogr2%2Fthumbnail%2F400x%3E%2Fformat%2Fwebp%2Fsharpen%2F70" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://pub-cdn-oss.chuangkit.com/designTemplate/2023/11/28/8f05eb60-fd31-4253-b682-09c0e8156b4b_thumb?v=1716931517000&imageMogr2%2Fthumbnail%2F400x%3E%2Fformat%2Fwebp%2Fsharpen%2F70" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://pub-cdn-oss.chuangkit.com/designTemplate/2023/11/28/8f05eb60-fd31-4253-b682-09c0e8156b4b_thumb?v=1716931517000&imageMogr2%2Fthumbnail%2F400x%3E%2Fformat%2Fwebp%2Fsharpen%2F70" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://pub-cdn-oss.chuangkit.com/designTemplate/2023/11/28/8f05eb60-fd31-4253-b682-09c0e8156b4b_thumb?v=1716931517000&imageMogr2%2Fthumbnail%2F400x%3E%2Fformat%2Fwebp%2Fsharpen%2F70" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                    </div>

                    <button onClick={scrollRight3} className="btn"><RightOutlined /></button>
                </div>
            </div>
            <div>
                <h2>公众号</h2>
                <div className="createbomcc">
                    <button onClick={scrollLeft4} className="btn"><LeftOutlined /></button>
                    <div className="nei" ref={containerRef4}>
                        {/* 在这里添加内容，例如多个图片或列表项 */}

                        <dl>
                            <dt>
                                <img src="https://pub-cdn-oss.chuangkit.com/designTemplate/2023/05/29/889eb408-6174-4e3f-ac91-913ab2911db0_thumb?v=1685349960000&imageMogr2%2Fthumbnail%2F400x%3E%2Fformat%2Fwebp%2Fsharpen%2F70" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://pub-cdn-oss.chuangkit.com/designTemplate/2023/05/29/889eb408-6174-4e3f-ac91-913ab2911db0_thumb?v=1685349960000&imageMogr2%2Fthumbnail%2F400x%3E%2Fformat%2Fwebp%2Fsharpen%2F70" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://pub-cdn-oss.chuangkit.com/designTemplate/2023/05/29/889eb408-6174-4e3f-ac91-913ab2911db0_thumb?v=1685349960000&imageMogr2%2Fthumbnail%2F400x%3E%2Fformat%2Fwebp%2Fsharpen%2F70" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://pub-cdn-oss.chuangkit.com/designTemplate/2023/05/29/889eb408-6174-4e3f-ac91-913ab2911db0_thumb?v=1685349960000&imageMogr2%2Fthumbnail%2F400x%3E%2Fformat%2Fwebp%2Fsharpen%2F70" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://pub-cdn-oss.chuangkit.com/designTemplate/2023/05/29/889eb408-6174-4e3f-ac91-913ab2911db0_thumb?v=1685349960000&imageMogr2%2Fthumbnail%2F400x%3E%2Fformat%2Fwebp%2Fsharpen%2F70" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://pub-cdn-oss.chuangkit.com/designTemplate/2023/05/29/889eb408-6174-4e3f-ac91-913ab2911db0_thumb?v=1685349960000&imageMogr2%2Fthumbnail%2F400x%3E%2Fformat%2Fwebp%2Fsharpen%2F70" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://pub-cdn-oss.chuangkit.com/designTemplate/2023/05/29/889eb408-6174-4e3f-ac91-913ab2911db0_thumb?v=1685349960000&imageMogr2%2Fthumbnail%2F400x%3E%2Fformat%2Fwebp%2Fsharpen%2F70" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://pub-cdn-oss.chuangkit.com/designTemplate/2023/05/29/889eb408-6174-4e3f-ac91-913ab2911db0_thumb?v=1685349960000&imageMogr2%2Fthumbnail%2F400x%3E%2Fformat%2Fwebp%2Fsharpen%2F70" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                    </div>

                    <button onClick={scrollRight4} className="btn"><RightOutlined /></button>
                </div>
            </div>
            <div>
                <h2>抖音/小红书</h2>
                <div className="createbomcc">
                    <button onClick={scrollLeft5} className="btn"><LeftOutlined /></button>
                    <div className="nei" ref={containerRef5}>
                        {/* 在这里添加内容，例如多个图片或列表项 */}

                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                    </div>

                    <button onClick={scrollRight5} className="btn"><RightOutlined /></button>
                </div>
            </div>
            <div>
                <h2>PPT/办公</h2>
                <div className="createbomcc">
                    <button onClick={scrollLeft6} className="btn"><LeftOutlined /></button>
                    <div className="nei" ref={containerRef6}>
                        {/* 在这里添加内容，例如多个图片或列表项 */}

                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                    </div>

                    <button onClick={scrollRight6} className="btn"><RightOutlined /></button>
                </div>
            </div>
            <div>
                <h2>印刷物料</h2>
                <div className="createbomcc">
                    <button onClick={scrollLeft7} className="btn"><LeftOutlined /></button>
                    <div className="nei" ref={containerRef7}>
                        {/* 在这里添加内容，例如多个图片或列表项 */}

                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                    </div>

                    <button onClick={scrollRight7} className="btn"><RightOutlined /></button>
                </div>
            </div>
            <div>
                <h2>H5</h2>
                <div className="createbomcc">
                    <button onClick={scrollLeft8} className="btn"><LeftOutlined /></button>
                    <div className="nei" ref={containerRef8}>
                        {/* 在这里添加内容，例如多个图片或列表项 */}

                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                    </div>

                    <button onClick={scrollRight8} className="btn"><RightOutlined /></button>
                </div>
            </div>
            <div>
                <h2>社交生活</h2>
                <div className="createbomcc">
                    <button onClick={scrollLeft9} className="btn"><LeftOutlined /></button>
                    <div className="nei" ref={containerRef9}>
                        {/* 在这里添加内容，例如多个图片或列表项 */}

                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                    </div>

                    <button onClick={scrollRight9} className="btn"><RightOutlined /></button>
                </div>
            </div>
            <div>
                <h2>视频</h2>
                <div className="createbomcc">
                    <button onClick={scrollLeft10} className="btn"><LeftOutlined /></button>
                    <div className="nei" ref={containerRef10}>
                        {/* 在这里添加内容，例如多个图片或列表项 */}

                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                    </div>

                    <button onClick={scrollRight10} className="btn"><RightOutlined /></button>
                </div>
            </div>
            <div>
                <h2>插画元素</h2>
                <div className="createbomcc">
                    <button onClick={scrollLeft11} className="btn"><LeftOutlined /></button>
                    <div className="nei" ref={containerRef11}>
                        {/* 在这里添加内容，例如多个图片或列表项 */}

                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                    </div>

                    <button onClick={scrollRight11} className="btn"><RightOutlined /></button>
                </div>
            </div>
            <div>
                <h2>电商</h2>
                <div className="createbomcc">
                    <button onClick={scrollLeft12} className="btn"><LeftOutlined /></button>
                    <div className="nei" ref={containerRef12}>
                        {/* 在这里添加内容，例如多个图片或列表项 */}

                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                        <dl>
                            <dt>
                                <img src="https://lupic.cdn.bcebos.com/20220107/3085838872_18_600_335.jpg" alt="" />
                            </dt>
                            <dd>
                                <p><span>手机海报</span></p>
                                <p>1242×2208px</p>
                            </dd>
                        </dl>
                    </div>
                    <button onClick={scrollRight12} className="btn"><RightOutlined /></button>
                </div>
            </div>

        </div>
    )
}

export default Index